<template>
	<view class="page-container">
		<back :showBackText="false" customClass="bg-gradual-blue text-white" title="请选择课程"></back>
		<view class="content-container" v-if="isLoad">
			<!-- 主布局：左侧考试类型，右侧课程列表 -->
			<view class="main-layout">
				<!-- 左侧考试类app/pages/index/profession型选择区域 -->
				<view class="left-panel">
					<view class="exam-type-item" 
						v-for="(examType, index) in examTypeList" 
						:key="examType.id" 
						:class="{ active: examType.active }" 
						@tap="switchExamType(examType.id)">
						<text>{{ examType.name }}</text>
					</view>
				</view>
				
				<!-- 右侧课程分类和列表区域 -->
					<view class="right-panel">
						<scroll-view scroll-y class="course-scroll-view">
							<!-- 循环专业和课程 -->
							<view class="category-section" 
								v-for="(profession, pIndex) in examData.professions" 
								:key="profession.id">
								<view class="category-title">{{ profession.name }}</view>
								<view class="category-underline"></view>
								<view class="course-list">
									<view class="course-item" 
							@tap="navigateToHome(course,profession)" 
							v-for="(course, cIndex) in profession.courses" 
							:key="course.id">
							<text class="course-name">{{ course.name }}</text>
							<text class="course-icon cuIcon-title" v-if="course.is_collected === 9"></text>
						</view>
								</view>
							</view>
						</scroll-view>
					</view>
			</view>
		</view>
	</view>
</template>
<style src="./select.css"></style>
<script src="./select.js"></script>